<template>
    <div class="production-plan">
      <!-- <el-button type="success" @click="addjihau" class="save-button">保存主表单和明细</el-button> -->
      <h3 class="title">质检工单信息详情页</h3>
  
      <el-descriptions
        class="quality-detail"
        :column="3"
        border
        title="质检工单信息"
      >
        <el-descriptions-item label="质检工单主题">{{ formData.qualityWorkOrder }}</el-descriptions-item>
        <el-descriptions-item label="质检工单编号">{{ formData.qualityWorkOrderNumber }}</el-descriptions-item>
        <el-descriptions-item label="来源工单">{{ formData.sourceWorkOrder }}</el-descriptions-item>
        <el-descriptions-item label="生产物品">{{ formData.generateItems }}</el-descriptions-item>
        <el-descriptions-item label="质检负责人">{{ formData.qualityPerson }}</el-descriptions-item>
        <el-descriptions-item label="质检部门">{{ formData.qualityDepartment }}</el-descriptions-item>
        <el-descriptions-item label="工序数量">{{ formData.processQuantity }}</el-descriptions-item>
        <el-descriptions-item label="备注信息">{{ formData.remarks }}</el-descriptions-item>
        <el-descriptions-item label="状态">{{ formData.status }}</el-descriptions-item>
      </el-descriptions>
  
      <el-form-item label="附件" style="margin-bottom: 20px;">
        <el-upload
            class="upload-demo"
            action="https://localhost:7229/api/Arrival/UploadDocument"
            :file-list="fileList"
            :on-success="handleSuccess"
            :on-remove="handleRemove"
            :before-upload="beforeUpload"
            :limit="5"
            :show-file-list="true"
            list-type="text"
            multiple>
            <el-button type="primary">点击上传</el-button>
            <template #tip>
            <div class="el-upload__tip">支持jpg/png/pdf文件，且不超过10MB</div>
            </template>
        </el-upload>
        </el-form-item>
    </div>
  </template>
  
  <script setup>
  import { ref, reactive, onMounted, watch } from 'vue';
  import { ElMessage, ElMessageBox } from 'element-plus';
  import { useRouter, useRoute } from 'vue-router';
  import { Materialread, Materialwrite } from '@/axios/axiosHelper';
  import axios from 'axios';
  import { th } from 'element-plus/es/locales.mjs';
  
  const formRef = ref(null);
  const currentUser = ref("admin");
  const router = useRouter();
  const route = useRoute();
  
  // 主表单数据
  const formData = reactive({
        "qualityid":  route.params.qualityid,
        "qualityWorkOrder": "",
        "qualityWorkOrderNumber": "",
        "sourceWorkOrder": "",
        "generateItems": "",
        "qualityPerson": "",
        "qualityDepartment": "",
        "processQuantity": '',
       "status": "",
        "remarks": "",
        "isDel": true
  });





const getProductionById = (qualityid) => {
console.log('查看专检申请反填数据:', qualityid);
Materialread.get('f-read/api/Arrival/FTQualityLnspection', {
    params:{
        Qualityid: route.query.qualityid
    }
  })
  .then(res=>{
    formData.qualityid = res.data.data[0].qualityid;
    formData.qualityWorkOrder = res.data.data[0].qualityWorkOrder;
    formData.qualityWorkOrderNumber = res.data.data[0].qualityWorkOrderNumber;
    formData.sourceWorkOrder = res.data.data[0].sourceWorkOrder;
    formData.generateItems = res.data.data[0].generateItems;
    formData.qualityPerson = res.data.data[0].qualityPerson;
    formData.qualityDepartment = res.data.data[0].qualityDepartment;
    formData.processQuantity = res.data.data[0].processQuantity;
    formData.status = res.data.data[0].status;
    formData.remarks = res.data.data[0].remarks;
    formData.modelValue = res.data.data[0];
    console.log('专检申请反填数据:', res.data);
  })
};


// // 保存主表单
 const addjihau = () => {
    Materialwrite.post('f-write/api/Arrival/UpdateQualityLnspection', formData)
    .then(response => {
     if (response.data.code === 200) {
       ElMessage.success('专检申请修改成功');
       console.log(response.data.data);
       router.push("/GetQualityLnspection");
    } else {
       ElMessage.error(`专检申请修改失败：${response.data.message}`);
    }
    })
};

onMounted(()=>{
  getProductionById();
})


 
 

    </script>
    
    <style scoped>
    .production-plan {
      padding: 30px;
      background-color: #f0f2f5;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
      font-family: 'Arial', sans-serif;
    }
    
    .title {
      text-align: center;
      margin-bottom: 30px;
      color: #2c3e50;
      font-size: 24px;
      font-weight: 600;
    }
    
    .save-button {
      display: block;
      margin: 0 auto 30px;
      padding: 12px 24px;
      font-size: 16px;
      border-radius: 6px;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }
    
    .form-container {
      background-color: white;
      padding: 30px;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
    }
    
    .el-form-item__label {
      color: #34495e;
      font-size: 16px;
      font-weight: 500;
    }
    
    .el-input,
    .el-input-number,
    .el-date-picker {
      border-radius: 6px;
      border: 1px solid #ccc;
      padding: 10px;
      font-size: 14px;
      transition: border-color 0.3s ease, box-shadow 0.3s ease;
    }
    
    .el-input:focus,
    .el-input-number:focus,
    .el-date-picker:focus {
      border-color: #42b983;
      outline: none;
      box-shadow: 0 0 5px rgba(66, 185, 131, 0.2);
    }
    </style>